{include file="public/header" /}
<!--main content start-->
<section class="main-content-wrapper">
    <section id="main-content">
        <div class="row">
    <div class="col-md-12">
        <div class="panel panel-default">
            <div class="panel-heading">
                <h3 class="panel-title">产品列表</h3>
                <!--<div class="actions pull-right">-->
                    <!--<i class="fa fa-chevron-down"></i>-->
                    <!--<i class="fa fa-times"></i>-->
                <!--</div>-->

            </div>
            <div class="panel-body">
                <form action="/admin/product/index" method="get" enctype="multipart/form-data">
                <div class="row" style="margin-bottom: 20px;">
                    <div class="col-md-2">
                        <select class="form-control input-sm" id="search_type" name="search_type">
                            <option value="">栏目</option>
                            {volist name="c_lists" id="vo"}
                            <option value="{$vo.id}">{$vo.name}</option>
                            {/volist}
                        </select>
                    </div>
                    <div class="col-md-3" style="padding-left: 0;">
                        <input type="text" class="form-control " placeholder="产品标题" name="title">
                    </div>
                    <div class="col-md-2" style="padding-right: 0;">
                        <input type="text" name="start_time" class="form-control form_datetime4" placeholder="开始时间">
                    </div>
                    <div class="col-md-2" style="padding-left: 0;padding-right: 0">
                        <input type="text" name="end_time" class="form-control form_datetime4" placeholder="结束时间">
                    </div>
                    <input type="submit" class="btn btn-primary" style="float: right;margin-right: 2%;" value="搜索">
                </div>
                </form>
                <div class="table-responsive">
                    <table class="table table-bordered ">
                        <thead>
                        <tr>
                            <th>#</th>
                            <th>产品标题</th>
                            <th>所属栏目</th>
                            <th>阅读数</th>
                            <th>发布/修改时间</th>
                            <th>操作</th>
                        </tr>
                        </thead>
                        <tbody>
                        {volist name="lists" id="vo"}
                        <tr class="bg_focuse">
                            <td><input class="" type="checkbox" name="checkbox">{$vo.id}</td>
                            <td>{$vo.title}</td>
                            <td>{$vo.name}</td>
                            <td>{$vo.read_num}</td>
                            <td>{$vo.add_time|date="Y-m-d H:i",###}</td>
                            <td><button type="button" class="btn btn-xs btn-default" onclick="operation('detail',{$vo.id})">修改</button> &nbsp; <button type="button" class="btn btn-xs btn-default" data-toggle="modal" data-target="#delete" onclick="operation('delete',{$vo.id})" >删除</button></td>
                        </tr>
                        {/volist}
                        </tbody>
                    </table>
                </div>
                {$lists->render()}
            </div>
        </div>
    </div>
</div>
    </section>
</section>
<style>
    .table-striped>tbody>tr:nth-child(odd)>td:hover{
         background-color: #fff;
    }
    .bg_focuse:hover td{background-color: #dff0d8;}
</style>
<script language="javascript" type="text/javascript">
    function operation(type,id){
        if(type=='delete'){
            $('.w_delete').attr('data-id',id);
        }
        if(type=='detail'){
            window.location.href="/admin/product/detail?id="+id;
        }
    }
</script>

<style>
    /*时间插件*/
    .add-on{display:inline-block;width:auto;height:40px;min-width:16px;padding:4px 5px;font-size:14px;font-weight:normal;line-height:32px;text-align:center;text-shadow:0 1px 0 #fff;background-color:#eee;border:1px solid #ccc}
    .input-prepend .add-on:first-child{-webkit-border-radius:4px 0 0 4px;-moz-border-radius:4px 0 0 4px;border-radius:4px 0 0 4px}
    .input-append .add-on{margin-left: -4px;}
    .input-append .add-on:last-child{margin-left:-4px;-webkit-border-radius:0 4px 4px 0;-moz-border-radius:0 4px 4px 0;border-radius:0 4px 4px 0}
    [class^="icon-"],[class*=" icon-"]{display:inline-block;width:14px;height:14px;margin-top:1px;*margin-right:.3em;line-height:14px;vertical-align:text-top;background-image:url("http://cdn.bootcss.com/twitter-bootstrap/2.2.2/img/glyphicons-halflings.png");background-position:14px 14px;background-repeat:no-repeat}
    .icon-th{background-position:-240px 0}
    .icon-remove{background-position:-312px 0}
    @media screen and (max-width: 850px) {
        .add-on {
            display: table-cell
        }
    }

</style>
<!--时间插件-->
<script src="/admin/js/bootstrap-datetimepicker.min.js"></script>
<link href="/admin/css/datetimepicker.css" rel='stylesheet' type='text/css' />


<script>
    $(".form_datetime4").datetimepicker({
        format: "yyyy-mm-dd hh:ii",
        autoclose: true,
        todayBtn: true
    });
</script>
<!--main content end-->
{include file="public/footer" /}